<template>
	<a-layout>
		<a-layout-content style="margin: 0 16px">
			<a-card  style="margin: 16px 0; text-align:center" title="急需处理的任务">
				<a-row type="flex">
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：服务</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：接口</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：服务器</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：sql server</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：mysql</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：elasticsearch</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：mongodb</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：rabbitmq</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
					<a-card-grid style="width:25%;text-align:center">
						<a-row>
							<a-row>
								<a-col>
									<a-row>
										<a-col :span="8">
											<span>数量：</span>
										</a-col>
										<a-col>
											<span>任务：redis</span>
										</a-col>
										<span><a-icon type="home" :style="{ fontSize: '80px', color: '#08c' }" /></span>
									</a-row>
								</a-col>
							</a-row>
						</a-row>
					</a-card-grid>
				</a-row>
			</a-card>
		</a-layout-content>
	</a-layout>
</template>
<script>
import { homeMenu, configurationMenu } from '@/views/data/menuItem';
export default {
	data() {
		return {
			collapsed: false,
			homeMenu,
			configurationMenu,
		};
	},
	created() {
		// console.log(this.homeMenu);
	},
};
</script>

<style>
.editable-row-operations a {
  margin-right: 8px;
}

.editable-add-btn {
  /* margin-bottom: 8px; */
  float: right;
}
</style>
